import { RouteRecordRaw, createRouter, createWebHashHistory, createWebHistory } from "vue-router";
import { useAppStore } from "@/stores/modules/app";
import { useAuthStore } from "@/stores/modules/auth";
import { LOGIN_URL } from "@/config";
import { e403 } from "./commonViews";
// import { initDynamicRouter } from "@/routers/modules/dynamicRouter";
import NProgress from "@/config/nprogress";

// * 导入所有router
const metaRouters = import.meta.glob("./modules/*.ts", { eager: true });

// * 处理路由表
export const routerArray: RouteRecordRaw[] = [];
Object.keys(metaRouters).forEach(item => {
  Object.keys(metaRouters[item] as object).forEach(key => {
    routerArray.push(...(metaRouters[item] as any)[key]);
  });
});

const routes: RouteRecordRaw[] = [
  ...routerArray,
  {
    // 找不到路由重定向到404页面
    path: "/:pathMatch(.*)",
    redirect: { name: "404" }
  }
];

const mode = import.meta.env.VITE_ROUTER_MODE;
const routerMode = {
  hash: () => createWebHashHistory(),
  history: () => createWebHistory()
};

/**
 * @description 📚 路由参数配置简介
 * @param path ==> 路由菜单访问路径
 * @param name ==> 路由 name (对应页面组件 name, 可用作 KeepAlive 缓存标识 && 按钮权限筛选)
 * @param redirect ==> 路由重定向地址
 * @param component ==> 视图文件路径
 * @param meta ==> 路由菜单元信息
 * @param meta.icon ==> 菜单和面包屑对应的图标
 * @param meta.title ==> 路由标题 (用作 document.title || 菜单的名称)
 * @param meta.activeMenu ==> 当前路由为详情页时，需要高亮的菜单
 * @param meta.isLink ==> 路由外链时填写的访问地址
 * @param meta.isHide ==> 是否在菜单中隐藏 (通常列表详情页需要隐藏)
 * @param meta.isFull ==> 菜单是否全屏 (示例：数据大屏页面)
 * @param meta.isAffix ==> 菜单是否固定在标签页中 (首页通常是固定项)
 * @param meta.isKeepAlive ==> 当前路由是否缓存
 * */
const router = createRouter({
  history: routerMode[mode](),
  routes,
  strict: false,
  scrollBehavior: () => ({ left: 0, top: 0 })
});

/**
 * @description 路由拦截 beforeEach
 * */
router.beforeEach((to, from, next) => {
  NProgress.start();
  // * 在跳转路由之前，清除所有的请求
  //   axiosCanceler.removeAllPending();

  console.log("[路由器]: 开始处理:1. ", from, to);

  // * 判断当前路由是否需要访问权限
  if (!to.matched.some(record => record.meta.requiresAuth)) return next();

  // console.log("路由开始处理:2. requiresAuth 结束");

  // * 判断是否有Token
  const appStore = useAppStore();

  // console.log("进入跳转路由, 当前的token:", appStore.token);
  if (!appStore.token) {
    // console.log("路由开始处理:3. 没有token跳到登录页面");
    next(LOGIN_URL);
    NProgress.done();
    return;
  } else {
    const authStore = useAuthStore();
    const authCode = authStore.authMRACodes.filter(e => (e.fullpath = to.fullPath))[0].code;

    // console.log("路由开始处理:4. 检测页面的权限 :", authCode);

    if (authStore.authRouterCodes.some(code => code == authCode)) {
      // console.log("路由开始处理:5. 页面权限通过.");
      next();
      return;
      // next({ ...to, replace: true });
    } else {
      // console.log("路由开始处理:6. 没有权限，403.");
      next(e403);
    }
  }

  // todo 权限较验

  // * 如果访问的地址没有在路由表中重定向到403页面
  //   if (routes.indexOf(to.path) !== -1) return next();
  //   next({
  //     path: "/403",
  //   });
  // console.log("路由开始处理:7. 正常不会到这里.");
  next();
});

// /**
//  * @description 重置路由
//  * */
// export const resetRouter = () => {
//   const authStore = useAuthStore();
//   authStore.flatMenuListGet.forEach(route => {
//     const { name } = route;
//     if (name && router.hasRoute(name)) router.removeRoute(name);
//   });
// };

/**
 * @description 路由跳转错误
 * */
router.onError(error => {
  NProgress.done();
  console.warn("路由错误", error.message);
});

/**
 * @description 路由跳转结束
 * */
router.afterEach(() => {
  NProgress.done();
});

export default router;
